.tabs-css-container {
    display: flex;

    .tabs-css-tabPane {
        padding: 12px;
    }

    .tabs-css-tabPane-active {
        border-bottom: #1890ff 1px solid;
        animation: example1 0.5s linear;
    }
}

@keyframes example1 {
    0% {
        border-bottom: rgba(24, 144, 255, 0) 1px solid;
        transform: translate(-60px);
        //opacity: 0;
    }

    100% {
        border-bottom: rgba(24, 144, 255, 1) 1px solid;
        //transform: translate(0);
        //opacity: 1;
    }
}

.demo-css {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 150px;
    margin: 100px auto;
    color: red;
    background-color: coral;

    //animation: animationMove 2s linear;
}

.demo-css:hover {
    //transform: scale3d(1.5, 1.5, 1.5);
    //animation: animationMove 2s linear infinite alternate;
    animation: animationMove 5s linear infinite normal;
}

@keyframes animationMove {
    from {
        //transform: rotate3D(0.5, 0, 0.5, 0deg);
        //transform: rotateZ(0deg);
        //transform: rotateY(0deg);
        color: indianred;
        //margin-left: 0;
        //transform: scale3d(1, 1, 1);
        transform: rotateX(0.5, 0deg);
    }
    to {
        //transform: rotateZ(360deg);
        color: darkred;
        //margin-left: 100px;
        //transform: scale3d(1.5, 1.5, 1.5);
        //transform: rotate3d(0.5, 0, 0.5, 360deg);
        transform: rotateX(360deg);
    }
}
